<template>
  <div class="ecg-interpretation pd-20">
    <el-row>
      <el-col :span="18">
        <el-form :inline="true">
          <el-form-item label="服务名称:">
            <el-input placeholder="请输入服务名称"
                      v-model="searchParams.name"
                      clearable
                      @clear="handleQuery"></el-input>
          </el-form-item>
          <el-form-item label="医院名称:">
            <el-input placeholder="请输入医院名称"
                      v-model="searchParams.hospitalName"
                      clearable
                      @clear="handleQuery"></el-input>
          </el-form-item>
          <el-form-item label="状态:">
            <el-select v-model="searchParams.isLoad"
                       placeholder="请选择状态"
                       clearable
                       @change="handleQuery"
                       @clear="handleQuery">
              <el-option v-for="item in statusList"
                         :key="item.id"
                         :label="item.label"
                         :value="item.id">
              </el-option>
            </el-select>
          </el-form-item>
        </el-form>
      </el-col>
      <el-col :span="6">
        <el-button type="primary"
                   @click="handleQuery">查 询</el-button>
        <el-button type="primary"
                   @click="handleOption('add', null)">新 增</el-button>
      </el-col>
    </el-row>
    <element-table class="mt-20"
                   v-loading="loading"
                   :columns="columns"
                   :data="tableData"
                   pager
                   :pageTotal="pageTotal"
                   :pageIndex="pageIndex"
                   :pageSize="pageSize"
                   @handleChangePage="handleChangePage">
      <template v-slot:option="{row}">
        <el-button type="primary"
                   @click="handleOption('edit', row)">编 辑</el-button>
        <el-button type="primary"
                   v-if="row.isLoad === 0"
                   @click="handleOption('isShelf', row)">上 架</el-button>
        <el-button type="primary"
                   v-if="row.isLoad === 1"
                   @click="handleOption('isShelf', row)">下 架</el-button>
        <el-button type="danger"
                   @click="handleOption('del', row)">删 除</el-button>
      </template>
    </element-table>
    <ecg-dialog :ECGObj="ECGObj"
                v-if="isECGDialog"
                :visible.sync="isECGDialog"></ecg-dialog>
  </div>
</template>
<script>
import elementTable from '@/base/ElementTable'
import ECGDialog from './ECGDialog'
export default {
  name: 'ecg-interpretation', // 心电解读管理
  data () {
    return {
      loading: false,
      searchParams: {
        name: '',
        hospitalName: '',
        isLoad: '',
      },
      statusList: [
        { id: 0, label: '下架' },
        { id: 1, label: '上架' },
      ],
      columns: [
        {
          label: '服务名称',
          prop: 'name',
          align: 'center',
          showToolTip: true
        },
        {
          label: '所属医院',
          prop: 'hospitalName',
          align: 'center'
        },
        {
          label: '服务价格（元）',
          prop: 'price',
          align: 'center'
        },
        {
          label: '服务选项数量',
          prop: 'serviceNum',
          align: 'center'
        },
        {
          label: '有效期（天）',
          prop: 'termOfValidity',
          align: 'center'
        },
        {
          label: '上线时间',
          prop: 'createTime',
          align: 'center',
          formatter: (row, cellValue) => {
            return this.commonFunction.timestampFormat(new Date(row.createTime), 'yyyy-MM-dd hh:mm:ss')
          }
        },
        {
          label: '状态',
          prop: 'isLoad',
          align: 'center',
          formatter: (row, cellValue) => {
            return row.isLoad === 0 ? <el-tag type="primary">下架</el-tag> : <el-tag type="danger">上架</el-tag>
          }
        },
        {
          label: '操作',
          prop: 'option',
          width: 250,
          isSlot: true
        }
      ],
      tableData: [],
      pageIndex: 1,
      pageTotal: 0,
      pageSize: 10,
      isECGDialog: false,
      ECGObj: {}
    }
  },
  methods: {
    handleQuery() {
      this.pageIndex=1
      this.getList()
    },
    async getList () {
      this.loading = true
      const { data: res } = await this.post(this.api.hospitalECG.remoteEcgProductList, {
        pageIndex: this.pageIndex - 1,
        pageSize: this.pageSize,
        ...this.searchParams
      })
      if (res.code === '200') {
        this.loading = false
        this.tableData = res.object
        this.pageTotal = res.totalNum
      }
    },
    // 操作
    handleOption (op, row) {
      switch (op) {
        case 'add':
          this.isECGDialog = true
          this.ECGObj = row
          break;
        case 'edit':
          this.isECGDialog = true
          this.ECGObj = row
          break;
        case 'isShelf':
          let str = row.isLoad === 1 ? '下架' : '上架'
          this.$confirm(`您是否要${str}该服务？`)
            .then(async _ => {
              const { data: result } = await this.post(this.api.hospitalECG.remoteEcgProductLoad, {
                id: row.id,
                remoteType: 4,
                isLoad: row.isLoad === 1 ? 0 : 1
              })
              if (result.code === '200') {
                this.$message.success(`${str}成功!`)
                this.getList()
              } else {
                this.$$message.error(result.message)
              }
            })
            .catch(_ => { });
          break;
        case 'del':
          this.$confirm('您是否要删除该服务？')
            .then(async _ => {
              const { data: res } = await this.post(this.api.hospitalECG.delRemoteEcgProduct, {
                id: row.id
              })
              if (res.code === '200') {
                this.$message.success('删除成功!')
                this.getList()
              } else {
                this.$$message.error(res.message)
              }
            })
            .catch(_ => { });
          break;
      }
    },
    // 分页
    handleChangePage (page) {
      this.pageIndex = page
      this.getList();
    },
  },
  components: {
    'element-table': elementTable,
    'ecg-dialog': ECGDialog,
  },
  created () {
    this.getList()
  }
}
</script>
<style scoped lang="scss">
</style>
